<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="/css/reset.css">
    <link rel="stylesheet" href="/css/header.css">
    <link rel="stylesheet" href="/css/footer.css">
    <link rel="stylesheet" href="/css/info.css">
    <link rel="stylesheet" href="/lib/font/iconfont.css">
    <link rel="stylesheet" href="/css/details.css">
    <link rel="stylesheet" href="/lib/swiper/swiper.css">
</head>
<body>
    <div id="header" style="z-index: 9999;"></div>

    <div id="details">
        <div class="wrap details">
            
        </div>
    </div>

    <script type="text/html" id="detailsTemplate">
        <div class="left clear_fix">
            <div class="small-ring">
                <div class="img-list" id="smPicBox">
                    {{each photo item}}
                    <a href="" data-image="{{item.url}}" data-zoom-image="{{item.url}}">
                        <img src="{{item.url}}" alt="">
                    </a>
                    {{/each}}
                </div>
            </div>
            <div class="big-ring">
                <img src="{{image}}" alt="" class="zoom-image">
            </div>
        </div>
        
        <div class="right clear_fix">
            <p class="top-title">对戒 ——产品编号 {{id}}</p>
            <div class="goods-name">{{title}}</div>
            <div class="ring-select-box">
                <ul class="ring-type">
                    {{each accessoryHints item}}
                    <li>{{item}}</li>
                    {{/each}}
                </ul>
                <!-- <div class="ring-select">
                    <div class="select1">
                        <em>女材质</em>
                        <span>
                            白18K金
                            <i class="iconfont icon-s-up-copy"></i>
                        </span>
                        <div class="expand-area">
                            <ul>
                                <li>白18K金</li>
                                <li>TP950</li>
                                <li>红18K金</li>
                                <li>黄18K金</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select1">
                        <em>女主钻</em>
                        <span>
                            5分H色
                            <i class="iconfont icon-s-up-copy"></i>
                        </span>
                        <div class="expand-area">
                            <ul>
                                <li>白18K金</li>
                                <li>TP950</li>
                                <li>红18K金</li>
                                <li>黄18K金</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select1">
                        <em>尺寸</em>
                        <span>
                            5
                            <i class="iconfont icon-s-up-copy"></i>
                        </span>
                        <div class="expand-area">
                            <ul>
                                <li>白18K金</li>
                                <li>TP950</li>
                                <li>红18K金</li>
                                <li>黄18K金</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select2">
                        <div>
                            <span>免费镌刻</span>
                            <span></span>
                            <span>点此添加</span>
                        </div>
                        <div class="litter-edit">
                            <div class="word">
                                是否需要艺术字
                                <span>
                                    <input type="radio" name="check-sure"  checked>
                                    是
                                </span>
                                <span>
                                    <input type="radio" name="check-sure">
                                    否
                                </span>
                            </div>
                            <div class="main-edit">
                                <input type="text" placeholder="请输入长度5个汉字或10个字母">
                                <i class="iconfont icon-xin"></i>
                                <i class="iconfont icon-and"></i>
                                <i>空格</i>
                            </div>
                            <div class="submit">确定</div>
                        </div>
                    </div>
                </div> -->
                <!-- <div class="ring-select">
                    <div class="select1">
                        <em>男材质</em>
                        <span>
                            白18K金
                            <i class="iconfont icon-s-up-copy"></i>
                        </span>
                        <div class="expand-area">
                            <ul>
                                <li>白18K金</li>
                                <li>TP950</li>
                                <li>红18K金</li>
                                <li>黄18K金</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select1">
                        <em>男主钻</em>
                        <span>
                            5分H色
                            <i class="iconfont icon-s-up-copy"></i>
                        </span>
                        <div class="expand-area">
                            <ul>
                                <li>白18K金</li>
                                <li>TP950</li>
                                <li>红18K金</li>
                                <li>黄18K金</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select1">
                        <em>尺寸</em>
                        <span>
                            5
                            <i class="iconfont icon-s-up-copy"></i>
                        </span>
                        <div class="expand-area">
                            <ul>
                                <li>白18K金</li>
                                <li>TP950</li>
                                <li>红18K金</li>
                                <li>黄18K金</li>
                            </ul>
                        </div>
                    </div>
                    <div class="select2">
                        <div>
                            <span>免费镌刻</span>
                            <span></span>
                            <span>点此添加</span>
                        </div>
                        <div class="litter-edit">
                            <div class="word">
                                是否需要艺术字
                                <span>
                                    <input type="radio" name="check-sure"  checked>
                                    是
                                </span>
                                <span>
                                    <input type="radio" name="check-sure">
                                    否
                                </span>
                            </div>
                            <div class="main-edit">
                                <input type="text" placeholder="请输入长度5个汉字或10个字母">
                                <i class="iconfont icon-xin"></i>
                                <i class="iconfont icon-and"></i>
                                <i>空格</i>
                            </div>
                            <div class="submit">确定</div>
                        </div>
                    </div>
                </div> -->
            </div>
            
            <div class="goods-price">¥ {{price}}</div>
            <div class="count">
                <input type="button" value="-" class="reduceBtn">
                <input type="text" value="1" class="countBox">
                <input type="button" value="+" class="addBtn">
            </div>
            <div class="goods-options">
                <div class="buy">立即购买</div>
                <div class="shopCars">加入购物袋</div>
            </div>
            <div class="appointment-btn">预约试戴</div>
            <p class="delivery">配送说明：预计15个工作日送达(限大陆地区),如需加急或者其他地区请咨询客服。</p>
            <div class="goods-info">
                <h2>细节描述</h2>
                <ul>
                    <li>商品分类： 女：情侣戒/男：情侣戒&nbsp;&nbsp;&nbsp;&nbsp;  净度：女：SI1/男：SI1</li>
                    <li>材质： 女：白18K金/男：白18K金 &nbsp;&nbsp;&nbsp;&nbsp;系列名称： 女：FOREVER系列/男：FOREVER系列</li>
                    <li>颜色： 女：H/男：H &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;副石材质： 女：钻石</li>
                    <li>主石大小： 女：0.05/男：0.1 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;副石数量： 女：24-24</li>
                    <li>主石材质： 女：钻石/男：钻石 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;产品编号： 女：QW0047/男：QM0047</li>
                    <li>副石总重： 女：0.09-0.12 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;主石数量： 女：1/男：1</li>
                    <li>形状： 女：圆形/男：圆形</li>
                </ul>
            </div>
            <p class="show-more">查看更多&nbsp;→</p>
            <ul class="more-options">
                <li>
                    评价
                    <span>></span>
                </li>
                <li>
                    服务
                    <span>></span>
                </li>
            </ul>
        </div>
    </script>


    <div id="info-show">
        <div class="wrap intruduce">
            
            
        </div>
    </div>
    <script type="text/html" id="introduceTemplate">
        {{each descContentList item}}
        <img src="{{item.image.url}}" alt="">
        {{/each}}
    </script>


    <div id="like">
        <div class="wrap">
            
        </div>
    </div>
    
    <div id="info"></div>
    <div id="footer"></div>

    <div class="loading">添加成功</div>

    <!-- <script src="/lib/jquery/jquery.js"></script>
    <script src="/lib/swiper/swiper.js"></script>
    <script src="/js/details.js"></script>
    <script>
        $('#header').load('/html/header.html')
        $('#info').load('/html/info.html')
        $('#footer').load('/html/footer.html')
    </script> -->
    <script src="/lib/requirejs/require.js" data-main="/js/details"></script>
</body>
</html>